<template>
  <el-dialog
    title="提示"
    :visible="isShowDialog"
    :before-close="handleClose"
    @close="hideData()">
    <span>这是一段信息</span>
    <span
      slot="footer"
      class="dialog-footer">
      <el-button @click="cancel">取 消</el-button>
      <el-button
        type="primary"
        @click="confirm">确 定</el-button>
    </span>
  </el-dialog>

</template>

<script>
export default {
  name: 'TestDialog',
  props: {
    isShowDialog: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done()
        })
        .catch(_ => {})
    },
    hideData() {
      this.$emit('hideDialog')
    },
    confirm() {
      this.$confirm('确认关闭？')
        .then(_ => {
          this.hideData()
        })
        .catch(_ => {})
    },
    cancel() {
      this.$confirm('确认关闭？')
        .then(_ => {
          this.hideData()
        })
        .catch(_ => {})
    }
  }
}
</script>

<style scoped>

</style>
